<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	template="/resources/template/template_bootstrap.xhtml">


	<ui:define name="title">Detalhes do Produto</ui:define>

	<ui:define name="conteudo">

		<div class="row-fluid">
			<div class="span12">


				<div class="row-fluid ">
					<div class="span4">
						<ui:include src="include/imagensdetalhes.xhtml" />
					</div>

					<div class="span8 descricao-produto">

						<div class="detalhes-produto">
							<h2>
								<h:outputText value="#{produtoMB.produto.nome}" />
							</h2>

							<h6 class="no-margin">
								<h:outputText
									rendered="#{produtoMB.produto.percentual_desconto>0}"
									styleClass="color-preco-antigo" value="De: " />

								<h:outputText
									rendered="#{produtoMB.produto.percentual_desconto>0}"
									styleClass="color-preco-antigo"
									value="#{produtoMB.produto.preco_venda}">
									<f:convertNumber type="currency" />
								</h:outputText>

								<h:outputText
									rendered="#{produtoMB.produto.percentual_desconto>0}" value=" " />

								<h:outputText value="por apenas: " styleClass="color-preco-novo" />

								<h:outputText value="#{produtoMB.produto.preco_venda_desconto}"
									styleClass="color-preco-novo">
									<f:convertNumber type="currency" />
								</h:outputText>
							</h6>

							<h6 class="no-bold no-margin parcelas-produto">
								<h:outputText
									value="Em até #{produtoMB.produto.numero_parcelas}x de " />

								<h:outputText
									value="#{produtoMB.produto.preco_venda_desconto/produtoMB.produto.numero_parcelas}">
									<f:convertNumber type="currency" />
								</h:outputText>

								<h:outputText value=" sem juros." />
							</h6>



							<div class="row-fluid">
								<div class="span12">
									<p:commandLink value="Comprar" styleClass="btn-virtual" rendered="#{produtoMB.hasProdutoEmEstoque(produtoMB.produto)}"
										action="#{carrinhoMB.addProdutoEIrCarrinho(produtoMB.produto)}" />
										
									<p:outputLabel rendered="#{!(produtoMB.hasProdutoEmEstoque(produtoMB.produto))}" 
									styleClass="produto-sem-estoque"
									value="Não temos esse produto em estoque nomomento." />	
								</div>
							</div>
						</div>

						<div class="row-flud">
							<h:form prependId="false">
								<ui:include src="/vender/frete.xhtml">
									<ui:param name="produto" value="#{produtoMB.produto}"></ui:param>
									<ui:param name="frete" value="#{carrinhoMB.freteProduto}"></ui:param>
								</ui:include>
							</h:form>
						</div>


						<p:outputPanel styleClass="avaliacao-produto" layout="block"
							rendered="#{produtoMB.hasUsuarioAutenticado()}">
							<ui:include src="/recomendar/_avaliacao.xhtml">
								<ui:param name="produto" value="#{produtoMB.produto}"></ui:param>
								<ui:param name="pessoa" value="#{produtoMB.usuarioLogado}"></ui:param>
							</ui:include>
						</p:outputPanel>

					</div>
				</div>


				<p:outputPanel layout="block"
					rendered="#{recomendarProdutoMB.recomendar}"
					styleClass="div-produtos-sugeridos margin-top">
					<h4 class="margin-top">Recomendamos para você</h4>
					<ui:include src="/recomendar/sugestao.xhtml"></ui:include>
				</p:outputPanel>



				<h4 class="margin-top">Descrição do produto:</h4>

				<p class="especificacoes-produto">
					<h:outputText value="#{produtoMB.produto.especificacoes}" />
				</p>


				<p:panelGrid id="tbl_especificacoes" columns="2" columnClasses="col">


					<h:outputText value="Modelo"
						rendered="#{produtoMB.isNotEmpty(produtoMB.produto.modelo)}" />
					<h:outputText value="#{produtoMB.produto.modelo}"
						rendered="#{produtoMB.isNotEmpty(produtoMB.produto.modelo)}" />

					<h:outputText value="Fabricante"
						rendered="#{produtoMB.isNotEmpty(produtoMB.produto.fabricante)}" />
					<h:outputText value="#{produtoMB.produto.fabricante}"
						rendered="#{produtoMB.isNotEmpty(produtoMB.produto.fabricante)}" />


					<h:outputText value="Link"
						rendered="#{produtoMB.isNotEmpty(produtoMB.produto.link)}" />
					<h:outputText value="#{produtoMB.produto.link}"
						rendered="#{produtoMB.isNotEmpty(produtoMB.produto.link)}" />

					<h:outputText value="Dimensões"
						rendered="#{produtoMB.isNotEmpty(produtoMB.produto.dimensoes)}" />
					<h:outputText value="#{produtoMB.produto.dimensoes} mm"
						rendered="#{produtoMB.isNotEmpty(produtoMB.produto.dimensoes)}" />

					<h:outputText value="Peso"
						rendered="#{!(produtoMB.produto.peso==0)}" />
					<h:outputText value="#{produtoMB.produto.peso} Kg"
						rendered="#{!(produtoMB.produto.peso==0)}" />

					<h:outputText value="Garantia"
						rendered="#{produtoMB.isNotEmpty(produtoMB.produto.garantia)}" />
					<h:outputText value="#{produtoMB.produto.garantia}"
						rendered="#{produtoMB.isNotEmpty(produtoMB.produto.garantia)}" />
				</p:panelGrid>

				<br />
			</div>
		</div>

	</ui:define>

</ui:composition>